<template>
  <div>
    <van-cell-group>
      <van-field v-model="fx.EntName" label="企业名称" @blur="blur" type="textarea" placeholder="请输入企业名称/简称" rows="1" autosize />
    </van-cell-group>
    <div class="logo">
      <h4>企业Logo</h4>
      <img :src="ent.logoUrl" alt="">
      <van-button type="primary" @click="fileopen" size="small" class="pub">更换</van-button>
    </div>
    <van-cell-group>
      <van-field v-model="fx.title" label="标题" type="textarea" placeholder="请输入自定义标题" rows="1" autosize />
      <van-field v-model="fx.content" label="内容" type="textarea" placeholder="请输入自定义内容" rows="2" autosize />
      <div data-v-d30f23d0="" class="van-cell van-hairline van-field">
        <!---->
        <div class="van-cell__title" style="flex:1;"><span>资源类型</span>
          <!---->
        </div>
        <div class="van-cell__value" style="flex:3;">
          <div class="van-field__body">
            <van-radio-group class="tl" v-model="calogIndex">
              <van-radio class="inline radioItem" v-for="(item,index) in catlog" :name="index" v-bind:key="index">{{item.name}}</van-radio>
            </van-radio-group>
            <!---->
            <!---->
            <!---->
          </div>
          <!---->
        </div>
        <!---->
      </div>
    </van-cell-group>
    <div class="btns">
      <van-button size="small" @click="showBJ=false" round type="warning">取消</van-button>
      <van-button size="small" @click="share" round type="primary">确定分享</van-button>
    </div>
    <input type="file" name="file" id="file" @change="fileupdate" ref="inputer" accept="image/*" v-show="false">
  </div>
</template>

<script>
  import api from "@/api/api";
  import {
    Toast
  } from "vant";
  export default {
    data() {
      return {
        catlog: [{
            name: '新疆棉',
            key: '1'
          },{
            name: '兵团棉',
            key: '6'
          },
          {
            name: '进口棉$',
            key: '4'
          },
          {
            name: '进口棉¥',
            key: '3'
          },
          {
            name: '地产棉',
            key: '2'
          },
          {
            name: '拍储棉',
            key: '5'
          }
        ],
        calogIndex: 0,
        batchNo: "",
        showBJ: false,
        fx: {
          EntName: "",
          title: "",
          content: "",
          showOwn: true,
          calogIndex:0
        },
        logoUrl: "",
        ent: {}
      };
    },
    methods: {
      blur() {
        if (!this.fx.EntName) {
          return;
        }
        api
          .getEntInfo({
            EntName: this.fx.EntName
          })
          .then(res => {
            if (!res) {
              Toast.fail({
                message: "企业信息获取失败！",
                duration: 1000
              });
              this.ent = {
                logoUrl: ''
              };
              return;
            } else {
              Toast.success({
                message: "获取成功！",
                duration: 1000
              });
              this.ent = res;
              this.fx.title = res.EntName;
              this.fx.content = "聚棉网为您推荐以下棉花";
              this.ent.logoUrl =
                "//www.icottontrade.com/cot/upload/logo/" + encodeURIComponent(this.ent.logoUrl);
            }
          });
      },
      fenxiang() {
        if (!this.$store.state.userInfo.ID) {
          Toast("请先登录");
          return false;
        }
        this.showBJ = true;
      },
      share() {
        var url = "";
        if (this.$route.name == "定制需求") {
          url =
            "https://www.icottontrade.com/cot/redirect/supply?UserID=" +
            this.$store.state.userInfo.ID;
        } else if (this.$route.name == "首页") {
          url =
            "https://www.icottontrade.com/cot/redirect?keyWords=" +
            encodeURI(this.batchNo);
          if (this.fx.showOwn) {
            url += "&showEntID=" + this.ent.ID;
          }
          console.log(url);
        } else {
          url =
            "https://www.icottontrade.com/cot/redirect?keyWords=" +
            encodeURI(this.batchNo);
          url += "&showEntID=" + this.ent.ID;
          url += "&catLogIndex=" + this.calogIndex;
          console.log(url)
        }
        var that = this;
        console.log("https:" + that.ent.logoUrl)
        wx.onMenuShareAppMessage({
          title: that.fx.title, // 分享标题
          desc: that.fx.content,
          link: url, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
          imgUrl: "https:" + that.ent.logoUrl, // 自定义图标
          type: "link", // 分享类型,music、video或link，不填默认为link
          dataUrl: "", // 如果type是music或video，则要提供数据链接，默认为空
          success: function() {
            // 用户确认分享后执行的回调函数
            Toast({
              message: "分享成功",
              duration: 1500
            });
          },
          cancel: function() {
            // 用户取消分享后执行的回调函数
          }
        });
        wx.onMenuShareTimeline({
          title: that.fx.title,
          link: url,
          imgUrl: "https:" + that.ent.logoUrl,  // 自定义图标
        });
        //Toast('点击右上角发送给微信好友或分享到朋友圈');
        //   this.$store.commit("setshare", true);
        //   this.showBJ = false;
        Toast("点击右上角发送给微信好友或分享到朋友圈");
      },
      fileopen: function() {
        if (!this.ent.ID) {
          Toast.fail('请先搜索企业！');
          return;
        }
        var fileSelect = document.getElementById("file");
        fileSelect.click();
      },
      fileupdate: function() {
        var that = this;
        if (!this.$store.state.userInfo.ID) {
          Toast("请先登录");
          return false;
        }
        let inputDOM = this.$refs.inputer;
        // 通过DOM取文件数据
        if (inputDOM.files.length == 0) {
          Dialog.alert({
            title: "提示",
            message: "请选择Excel文件或图片上传！"
          }).then(() => {
            return false;
          });
        }
        this.file = inputDOM.files[0];
        var formdata = new FormData();
        formdata.append("file", inputDOM.files[0]);
        let data = {
          EntName: this.ent.EntName,
          EntID: this.ent.ID
        };
        formdata.append("data", JSON.stringify(data));
        let config = {
          headers: {
            "Content-Type": "multipart/form-data"
          }
        };
        Toast.loading({
          mask: true,
          message: "正在上传..."
        });
        this.$http
          .post("/uploadEntLogo", formdata, config)
          .then(function(res) {
            Toast.clear();
            that.ent.logoUrl =
              "//www.icottontrade.com/cot/Upload/logo/" + res.data.data;
            if (res.data.success) {
              Dialog.alert({
                title: "提示",
                message: "上传成功！"
              }).then(() => {
                var fileSelect = document.getElementById("file");
                fileSelect.value = "";
              });
            } else {
              Toast.fail(res.data.data);
            }
          })
          .catch(function(err) {
            console.log(err);
          });
      },
      onRead(file) {
        console.log(file);
        var that = this;
        let formData = new FormData();
        let data = {
          fileName: file.file.name,
          content: file.content,
          size: file.file.size,
          EntID: this.ent.ID,
          EntName: this.ent.EntName,
          UserName: this.$store.state.userInfo.XM,
          UserID: this.$store.state.userInfo.ID
        };
        // formData.append('file', file.content);
        // formData.append('EntID', data.EntID);
        // formData.append('EntName', data.EntName);
        // formData.append('UserName', data.UserName);
        // formData.append('UserID', data.UserID);
        // formData.append('file', JSON.stringify(data));
        formData.append("file", file.file);
        let config = {
          headers: {
            "Content-Type": "multipart/form-data"
          }
        };
        console.log(file.file);
        that.$http.post("/addAttach", formData, config).then(function(res) {
          // that.fileNames.push(res.data.data);
          // that.fileList.push(that.webUrl + res.data.data);
        });
      }
    }
  };
</script>

<style scoped lang='less'>
  .radioItem {
    width: 6em !important;
    text-align: left;
    display: inline-block;
  }
  .tl{
    text-align: left !important;
   }
  .logo {
    text-align: center;
    background: #fff;
    h4 {
      line-height: 2em;
    }
    .inline {
      position: relative;
      top: 5px;
    }
    .btns {
      text-align: right;
      padding: 10px;
      margin-bottom: 30px;
    }
    .ml1em {
      margin-left: 1em;
    }
    .btnPrice {
      margin-top: 1em;
    }
    .inline {
      text-align: left;
      .van-radio {
        display: inline-block;
      }
    }
    img {
      height: 100px;
      width: 100px;
      border: 1px solid #ccc;
    }
  }
  .pub {
    width: 50%;
    display: block;
    margin: 1em auto;
    background: #2cb98e;
    border: 1px solid #2cb98e;
  }
  .sharebtn {
    position: fixed;
    bottom: 70px;
    right: 20px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    background: rgba(45, 186, 186, 0.6);
    border-radius: 50%;
    text-align: center;
    color: #fff;
    i {
      font-size: 18px;
    }
    h4 {
      font-size: 12px;
    }
  }
  .mask {
    position: fixed;
    height: 100%;
    width: 100%;
    background: rgba(0, 0, 0, 0.3);
    .info {
      height: 6em;
      font-size: 14px;
      text-align: center;
      padding: 20px;
      border: 1px dotted;
    }
  }
</style>